//引入响应式data数据
import {
  createReactive
} from '../../MyVue3.0';

//定义组件视图
const template = `
  <ul class="list">
    <h1>{{ title }}</h1>
    {{ dateTime }}
    <for data="list" tag="li" class="item">
      <span>name: { name }</span>
      <span>age: { age }</span>
    </for>
  </ul>
`

function TestB() {
  //创建state数据
  const state = createReactive({
    title: '老师信息列表',
    dateTime: '2021-02-03 10:23',
    list: [{
      id: 1,
      name: '马老师',
      age: 28
    }, {
      id: 2,
      name: '赵老师',
      age: 29
    }, {
      id: 3,
      name: '李老师',
      age: 30
    }]
  });

  //返回模板和数据
  return [template, state];
}

export default TestB;